<template>
	<m-layout2 class="layout-box flex-column" title="开票记录" gap="24">
		<m-block v-if="list.length>0" bg-color="unset">
			<m-block class="flex-column" v-for="item in list" spa="0 0 16" gap="24">
				<view class="flex-column listUl fs26">
					<!-- <view class="li flex-between ptb-16 border-bottom">
						<text>开票名称</text>
						<text>{{item.iname}}</text>
					</view>
					<view class="li flex-between ptb-16">
						<text>税号</text>
						<text>{{item.icode}}</text>
					</view> -->
				</view>
			</m-block>
		</m-block>
		<m-empty :list="list" icon="address_empty"></m-empty>
	</m-layout2>
</template>

<script>
	import { invr } from "@/api/Order.js"
	import { mapState } from 'vuex'
	export default {
		data() {
			return {
				list: [],
				isLoading: false,
				pageIndex: 1,
				pageSize: 10,
			};
		},

		onShow() {
			this.$nextTick(() => {
				this.init();
			});
		},
		methods: {
			init() {
				this.pageCount = 1;
				this.pageIndex = 1;
				this.getData();
			},
			async getData() {
				if (this.pageIndex > this.pageCount) {
					return
				}
				this.isLoading = true;
				const { list, pageCount } = await invr({
					pageSize: this.pageSize,
					pageIndex: this.pageIndex,
				});
				console.log('list===>', list)
				this.isLoading = false;
				this.pageCount = pageCount;
				if (this.pageIndex <= 1) {
					this.listArr = list;
				} else {
					this.listArr = [...this.listArr, ...list];
				}
				this.pageIndex++;
				uni.stopPullDownRefresh();

			},
		},
		onPullDownRefresh() {
			this.init();
		},
		onReachBottom() {
			this.getData();
			console.log("触底了");
		},
	}
</script>

<style lang="scss">
	.layout-box {
		box-sizing: border-box;
		position: relative;

		::v-deep .body {
			padding-bottom: 160rpx !important;
		}

		.footer {
			position: fixed;
			bottom: 0;
			width: 100%;
			box-sizing: border-box;
		}
	}

	.block_item {
		padding: 23rpx 24rpx;
		border-bottom: 1rpx solid #F5F5F5;

		.h1 {
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #999999;
		}

		.h2 {
			padding: 10rpx 0;
			font-size: 32rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #333333;
		}

		.h3 {
			.name {
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #333333;
			}

			.phone {
				padding: 0 15rpx;
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #999999;
			}

			.uni-tag+.uni-tag {
				margin-left: 10rpx;
			}

		}
	}

	.setName-box {
		padding: 24rpx 0rpx;

		.form-Item {
			background: #fff;
			border-radius: 15rpx;
			box-sizing: border-box;

			input {
				border-radius: 15rpx;
				padding: 20rpx 28rpx;
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: 400;
				color: #111;
				background: #f6f6f6;
			}
		}

		.hint {
			padding: 24rpx 0 0;
			font-size: 24rpx;
			color: var(--text_1);
		}
	}

	.addBox {
		::v-deep .uni-popup__wrapper {
			width: 100%;
			display: flex;
			justify-content: center;

			.my-modal {
				width: 90%;
			}
		}

		::v-deep .body {
			padding-bottom: 20rpx !important;
		}
	}
</style>